<!DOCTYPE html>
<html>
	<?php echo $head; ?>
	<body>
		<!-- Home -->
		<div data-role="page" id="page1">
			<div data-theme="b" data-role="header" data-id="head" data-position="fixed">
				<a href="<?php echo $this->input->server("REDIRECT_URL");?>" data-role="button" data-direction="reverse" data-transition="flow" data-rel="back" data-icon="arrow-left" data-iconpos="left" class="ui-btn-left">
					Back
				</a>
				<h3>
					Detail Stasiun
				</h3>
			</div>
			<div data-role="content">
					<?php if($detail != NULL): ?>
					<div data-role="collapsible" data-theme="a" data-content-theme="a" data-collapsed="false">
						<h2>Nama Stasiun</h2>
						Stasiun <?php echo $detail[0]->Nama_Stasiun; ?> ( <?php echo $detail[0]->Kode; ?> )
							
					</div>
					<div data-role="collapsible" data-theme="a" data-content-theme="a" data-collapsed="false">
						<h2>Alamat</h2>
						<?php echo $detail[0]->Alamat; ?>
					</div>
					<div data-role="collapsible" data-theme="a" data-content-theme="a" data-collapsed="false">
						<h2>Peta</h2>
						<div id="map_canvas" style="height:300px;border-radius:2px;"></div>
					</div>
					<div data-role="collapsible" data-theme="a" data-content-theme="a" data-collapsed="false">
						<h2>Informasi Lain</h2>
						<?php echo $detail[0]->Informasi; ?>
					</div>
					<?php else: ?>
						<h3>Data tidak ditemukan</h3>
					<?php endif; ?>
				</ul>
			</div>
			<?php echo $foot;?>
		</div>
		<!-- maps -->
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
		<script src="<?php echo base_url('js/jquery.ui.map.full.min.js'); ?>" type="text/javascript"></script>
		<script>
			$('#map_canvas').gmap('addMarker', {'position': '<?php echo $detail[0]->lat; ?>,<?php echo $detail[0]->lng; ?>', 'bounds': true});
		</script>
	</body>
</html>
